<?php if (!defined('THINK_PATH')) exit();?><!DOCTYPE html>
<html><head>
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <title>demo</title>
    <link rel="stylesheet" href="/Public/css/bootstrap.min.css"/>
    <link rel="stylesheet" href="/Public/css/jquery.jOrgChart.css"/>
    <link rel="stylesheet" href="/Public/css/custom.css"/>
    <link href="/Public/css/prettify.css" type="text/css" rel="stylesheet" />

    <script type="text/javascript" src="/Public/js/prettify.js"></script>
    
    <!-- jQuery includes -->
    <script type="text/javascript" src="/Public/js/jquery.min.js"></script>
    <script type="text/javascript" src="/Public/js/jquery-ui.min.js"></script>
    
    <script src="/Public/js/jquery.jOrgChart.js"></script>

    <script>
    jQuery(document).ready(function() {
        $("#org").jOrgChart({
            chartElement : '#chart',
            dragAndDrop  : true
        });
    });
    </script>
  </head>
	<style>
    
        table tr td{
            line-height: 25px !important;
        }
        .col>td{
            width: 10%;
        }
        .jOrgChart .node{
            width: 120px;
            border: none;
        }

	</style>
  <body onload="prettyPrint();">
    
    <ul id="org" style="display:none">
        <?php if(is_array($list)): foreach($list as $key=>$vo): if(!empty($vo['sub_menu'])): ?><li>
                
                    <table style="text-align:center;width:100%" border="1">
                        <tr><td colspan="3">姓名：</td></tr>
                        <tr><td colspan="3">编号：</td></tr>
                        <tr><td colspan="3">日期</td></tr>
                        <tr class="col"><td>1</td><td>2</td><td>3</td></tr>
                        <tr class="col"><td>1</td><td>2</td><td>3</td></tr>
                    </table>
                <ul>
                     <?php if(is_array($vo['sub_menu'])): foreach($vo['sub_menu'] as $key=>$v): ?><li>
                                <table style="text-align:center;width:100%" border="1">
                                    <tr><td>123456</td></tr>
                                    <tr><td>123456</td></tr>
                                    <tr><td>123456</td></tr>
                                    <tr><td>123456</td></tr>
                                    <tr><td>123456</td></tr>
                                </table>
                                <?php if(!empty($v['sub_menu'])): ?><ul>
                                    <?php if(is_array($v['sub_menu'])): foreach($v['sub_menu'] as $key=>$val): ?><li>
                                        <table style="text-align:center;width:100%" border="1">
                                            <tr><td>123456</td></tr>
                                            <tr><td>123456</td></tr>
                                            <tr><td>123456</td></tr>
                                            <tr><td>123456</td></tr>
                                            <tr><td>123456</td></tr>
                                        </table> 
                                    </li><?php endforeach; endif; ?>
                                </ul><?php endif; ?>  
                            </li><?php endforeach; endif; ?>

                </ul>
            </li><?php endif; endforeach; endif; ?>
    <!-- <li>
       <table style="border: 1px solid #f00;text-align:center;width:100%">
		<tr><td>123456</td></tr>
		<tr><td>123456</td></tr>
		<tr><td>123456</td></tr>
		<tr><td>123456</td></tr>
		<tr><td>123456</td></tr>
	   </table>
       <ul>
         <li>
			<table style="border: 1px solid #f00;">
				<tr><td>123456</td></tr>
				<tr><td>123456</td></tr>
				<tr><td>123456</td></tr>
				<tr><td>123456</td></tr>
				<tr><td>123456</td></tr>
			</table>
           <ul>
             <li>
			 <table style="border: 1px solid #f00;">
				<tr><td>123456</td></tr>
				<tr><td>123456</td></tr>
				<tr><td>123456</td></tr>
				<tr><td>123456</td></tr>
				<tr><td>123456</td></tr>
			</table>
			 </li>
             <li>
                <table style="border: 1px solid #f00;">
					<tr><td>123456</td></tr>
					<tr><td>123456</td></tr>
					<tr><td>123456</td></tr>
					<tr><td>123456</td></tr>
					<tr><td>123456</td></tr>
				</table>
             </li>
           </ul>
         </li>
         <li>
			<table style="border: 1px solid #f00;">
				<tr><td>123456</td></tr>
				<tr><td>123456</td></tr>
				<tr><td>123456</td></tr>
				<tr><td>123456</td></tr>
				<tr><td>123456</td></tr>
			</table>
           <ul>
             <li>
				<table style="border: 1px solid #f00;">
				<tr><td>123456</td></tr>
				<tr><td>123456</td></tr>
				<tr><td>123456</td></tr>
				<tr><td>123456</td></tr>
				<tr><td>123456</td></tr>
				</table>
			 </li>
             <li>
			 <table style="border: 1px solid #f00;">
				<tr><td>123456</td></tr>
				<tr><td>123456</td></tr>
				<tr><td>123456</td></tr>
				<tr><td>123456</td></tr>
				<tr><td>123456</td></tr>
			</table>
			 </li>
           </ul>
         </li>
       </ul>
     </li> -->
   </ul>            
    <div id="chart" class="orgChart"></div>
    
    <script>
        jQuery(document).ready(function() {
            
            /* Custom jQuery for the example */
            $("#show-list").click(function(e){
                e.preventDefault();
                
                $('#list-html').toggle('fast', function(){
                    if($(this).is(':visible')){
                        $('#show-list').text('Hide underlying list.');
                        $(".topbar").fadeTo('fast',0.9);
                    }else{
                        $('#show-list').text('Show underlying list.');
                        $(".topbar").fadeTo('fast',1);                  
                    }
                });
            });
            
            $('#list-html').text($('#org').html());
            
            $("#org").bind("DOMSubtreeModified", function() {
                $('#list-html').text('');
                
                $('#list-html').text($('#org').html());
                
                prettyPrint();                
            });
        });
    </script>

</body>
</html>